@import '../../../core/index.less';

.phone-state-wrapper {
    height: @header-height;
    width: 100%;
    position: relative;
    background: @white;
    display: none;
    justify-content: center;
    align-items: center;
    border-bottom: 1/@remScale solid #eeeeee;
    .phone-state-item {
        flex: 1;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #666;
        font-size: 16/@remScale;
        cursor: pointer;
        border-right: 1/@remScale solid @border-color;
        line-height: 32/@remScale;
        .active {
            color: @light-blue-color;
        }
        &:last-of-type {
            border-right: none;
        }
    }
    .translate-line {
        position: absolute;
        bottom: 0;
        height: 2/@remScale;
        left: 0;
        background: @light-blue-color;
        transition: all .5s;
    }
    @media (max-width: @max1) {
        display: flex;
    }
}
